<template>
  <div>
    <p-input
      placeholder="Basic usage"
      v-model="value"
      readonly
      @change="onChangeMaterialNo"
      ref="userNameInput"
      @click="openPop"
      :disabled="disabled"
    >
      <p-icon
        slot="prefix"
        type="cluster"
      />
    </p-input>
    <p-modal
      title="请选择"
      :visible="visible"
      @ok="handleOk"
      @cancel="handleCancel"
      cancelText="关闭"
      width="70%"
    >
      <ong-list
        :recode="reportCode"
        :context="context"
        @callback="callbackMid"
        ref="fxFlieRef"
      ></ong-list>
    </p-modal>
  </div>
</template>
<script>
import { getColumns, getData, getQueryInfo } from '@/api/api'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import ongList from './modules/OnlCgreportAutoList'
export default {
  name: 'FxPopup',
  components: {
    ongList
  },
  props: {

    value: {
      type: String,
      required: false
    },
    contextPath: {
      type: String,
      default: ''
    },
    tdId: {
      type: String,
      default: '0'
    },
    code: {
      type: String,
      default: ''
    },
    orgFields: {
      type: String,
      default: []
    },
    destFields: {
      type: String,
      default: []
    },
    disabled: {
      type: Boolean,
      default: false
    },
    multiple: {
      type: Boolean,
      default: false
    },
  },
  data () {
    return {
      refShow: false,
      visible: false,
      listVisble: false,
      confirmLoading: false,
      userName: 'username',
      codeStr: this.code,
      context: this.contextPath === '' ? '' : '/' + this.contextPath,
      reportCode: '',
      list: [],
      orgField: this.getList(this.orgFields),
      isorter: {
        column: 'createTime',
        order: 'desc'
      },
      selectionId: '0',
      selectedRowKeys: [],
      selectionRows: [],
      toggleSearchStatus: false
    }
  },
  watch: {
    orgFields: {
      deep: true,
      handler (val) {
        this.orgField = this.getList(val)
      }
    }
  },
  created () {
    const vm = this
    getColumns(vm.codeStr).then(res => {
      if (res.success) {
        vm.columns = res.data.columns
        vm.reportCode = res.data.cgRpConfigId
      }
    })
  },
  methods: {
    getList (val) {
      let array = []
      array = val.split(',')
      return array
    },
    onChangeMaterialNo (e) {
      console.log(e)
    },
    openPop () {
      const vm = this.orgField
      this.visible = true
      this.refShow ? this.$refs.fxFlieRef.setTableRow() : ''
      this.refShow = true
      for (let i = 0; i < vm.length; i++) {
        this.list.push({
          label: vm[i],
          value: vm[i]
        })
      }
    },
    onSelectChange (selectedRowKeys) {
      this.selectedRowKeys = selectedRowKeys
    },
    onSelect (record, selected) {
      if (selected == true) {
        this.selectionRows.push(record)
      } else {
        this.selectionRows.forEach(function (item, index, arr) {
          if (item.id == record.id) {
            arr.splice(index, 1)
          }
        })
      }
    },
    changeList (index) {
      index === 0 ? (this.listVisble = true) : index
    },
    toHump (name) {
      return name.replace(/\_(\w)/g, function (all, letter) {
        return letter.toUpperCase();
      });
    },
    handleOk () {
      this.visible = false
      let arr = this.orgFields.split(',')
      let newSelectionRows = []
      let param = {}; // 新生成一个新的数组出来,来保存需要过滤的数据
      var keyMap = {}
      this.destFields.split(',').forEach((item, index) => {
        newSelectionRows.push(this.toHump(item))
      })
      arr.forEach((item, index) => {
        if (this.selectionRows[item] != undefined) {
          param[item] = this.selectionRows[item].toString()
        }
        keyMap[item] = newSelectionRows[index]
      })
      for (var key in param) {
        var newKey = keyMap[key];
        if (newKey) {
          if (param[newKey] !== param[key]) {
            param[newKey] = param[key];
            delete param[key];
          }
        }
      }
      console.log(param);
      this.$emit('callback', param)
      this.$emit("input", this.selectionId, param)
      this.handleCancel()
      this.selectedRowKeys = []
      this.selectionRows = []
    },
    callbackMid (row) {
      this.selectionId = this.value
      this.selectionRows = row
    },
    handleCancel () {
      this.visible = false
      this.list = []
    },
    shutdown () {
      this.listVisble = false
    }
  },
  mounted () { }
}
</script>

<style lang="less" scoped></style>
